import styles from './index.less';
import { IRouteComponentProps, Loading, TagModelState, useIntl, useSelector } from 'umi';
// import React, { Component } from 'react';
// interface Props {
//   label: string;
//   articleCount: number;
// }

// export default class taghead extends Component<Props> {
//   state = {};

//   render() {
//     const intl = useIntl();
//     const { label, articleCount } = this.props;

//     /*
//       {intl.formatMessage({id:'categoryArticle'})}

//       "yu": "与",
//     "tagRelativeArticles": "标签有关的文章",
//     */
//     return (
//       <div className={styles.taghead}>
//         <p>
//           {intl.formatMessage({ id: 'yu' })}
//           {/*  */}
//           <span>{label}</span>
//           {/*  */}
//           {intl.formatMessage({ id: 'tagRelativeArticles' })}
//         </p>
//         <p>
//           {/* 共搜索到 */}
//           {intl.formatMessage({ id: 'totalSearch' })}
//           <span>{articleCount}</span>
//           {intl.formatMessage({ id: 'piece' })}
//         </p>
//       </div>
//     );
//   }
// }

const taghead=() => {
  // const id = props.match.params.id;
  const intl = useIntl();
  const { tag } = useSelector(
    (state: { tag: TagModelState; loading: Loading }) => {
      return {
        tag: state.tag,
        loading: state.loading,
      };
    },
  );
  return (
    <div className={styles.taghead}>
      <p>
        {intl.formatMessage({ id: 'yu' })}
        {/*  */}
        <span>{tag.tagDetailList.label}</span>
        {/*  */}
        {intl.formatMessage({ id: 'tagRelativeArticles' })}
      </p>
      <p>
        {/* 共搜索到 */}
        {intl.formatMessage({ id: 'totalSearch' })}
        <span>{tag.tagDetail.length}</span>
        {intl.formatMessage({ id: 'piece' })}
      </p>
    </div>
  );
};

export default taghead

